﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="DutyWeb.testLab.WebForm1" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title>modalPopup入门</title>
    <style type="text/css">
        /*Modal Popup*/.modalBackground
        {
            background-color: Gray;
            filter: alpha(opacity=70);
            opacity: 0.7;
        }
        .modalPopup
        {
            background-color: #ffffdd;
            border-width: 3px;
            border-style: solid;
            border-color: Gray;
            padding: 3px;
            width: 250px;
        }
        .sampleStyleA
        {
            background-color: #FFF;
        }
        .sampleStyleB
        {
            background-color: #FFF;
            font-family: monospace;
            font-size: 10pt;
            font-weight: bold;
        }
        .sampleStyleC
        {
            background-color: #ddffdd;
            font-family: sans-serif;
            font-size: 10pt;
            font-style: italic;
        }
        .sampleStyleD
        {
            background-color: Blue;
            color: White;
            font-family: Arial;
            font-size: 10pt;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:ScriptManager ID="ScriptManager1" runat="server" />
        <asp:LinkButton ID="LinkButton1" runat="server" Text="Click here to change the paragraph style" />
        <asp:Panel ID="Panel1" runat="server" Style="display: none" CssClass="modalPopup">
            <asp:Panel ID="Panel3" runat="server" Style="cursor: move; background-color: #DDDDDD;
                border: solid 1px Gray; color: Black">
                标题
            </asp:Panel>
            <div>
                内容
                <p style="text-align: center;">
                    <asp:Button ID="OkButton" runat="server" Text="OK" />
                    <asp:Button ID="CancelButton" runat="server" Text="Cancel" />
                </p>
            </div>
        </asp:Panel>
        <ajaxToolkit:ModalPopupExtender ID="ModalPopupExtender" runat="server" TargetControlID="LinkButton1"
            PopupControlID="Panel1" BackgroundCssClass="modalBackground" OkControlID="OkButton"
            CancelControlID="CancelButton" DropShadow="true" PopupDragHandleControlID="Panel3" />
    </form>
</body>
</html>
